<template>
  <div class="abnormal">
    <div class="abnormal-dialog-header">
      <span>查看日志</span>
    </div>
    <div class="abnormal-handle-box">
      <el-table :data="tableData" stripe style="width: 100%" v-loading="loading" border>
        <template v-for="(item,index) in logData">
          <el-table-column
            :key="index"
            v-if="item.value!='operationtime'"
            :prop="item.value"
            :label="item.label"
            align="center"
          ></el-table-column>
          <el-table-column
            :key="index"
            v-if="item.value=='operationtime'"
            :label="item.label"
            min-width="110px"
            align="center"
          >
            <template slot-scope="scope">
              <span>{{scope.row.operationtime}}</span>
            </template>
          </el-table-column>
        </template>
      </el-table>
    </div>
  </div>
</template>
<script>
export default {
  data () {
    return {
      logData: [
        {
          label: "操作人员",
          value: "operator"
        }, {
          label: "工号",
          value: "number"
        },
        {
          label: "部门",
          value: "department"
        },
        {
          label: "岗位角色",
          value: "position"
        },
        {
          label: "操作事件",
          value: "operationalevents"
        },
        {
          label: "处理意见",
          value: "content"
        },
        {
          label: "操作时间",
          value: "operationtime"
        }
      ],
      tableData: [],
      loading: true
    }
  },
  created () {
    this.getData();
  },
  props: ['reportid'],
  methods: {
    getData () {
      this.$axios.post('app/v1/platform/unusual/logDetail',
        { reportid: this.reportid }
      ).then(resp => {
        if (resp.data.message === 'success.') {
          this.tableData = resp.data.data;
          // this.pages.total = resp.data.data.length;
          this.loading = false;

        }
      })
    }
  },
  watch: {
    reportid (newVal) {
      this.getData();
    }
  }
}
</script>
<style>
.abnormal {
  padding: 10px 15px;
}

.abnormal-dialog-header {
  font-size: 16px;
  box-sizing: border-box;
  padding: 20px;
  border-bottom: 1px solid #e4e4e4;
}

.abnormal-dialog-header::before {
  content: "";
  border-left: 10px solid #0064e4;
  margin-right: 10px;
}

.abnormal-detail-box {
  box-sizing: border-box;
  padding: 20px;
  border-bottom: 1px dashed #e4e4e4;
}
</style>


